<!DOCTYPE html>
<html>
<head>
    <meta charset=utf-8>
    <title>CSS Fonts Test: @font-feature-values rule parsing tests</title>
    <link rel="author" title="Hiromi Morikawa" href="mailto:hiromitsuuuuu@gmail.com">
    <!-- You must have at least one spec link, but may have as many as are covered in the test. -->
    <!-- Be sure to make the main testing area first in the order -->
    <link rel="help" href="http://www.w3.org/TR/css3-fonts/#font-face-rule">
    <!-- The match link is only required if this is a reftest -->
    <!--<link rel="match" href="reference/REFERENCE-FILE-NAME">
    <meta name="flags" content="">-->
    <meta name="assert" content="tests that valid @font-feature-values rules parse and invalid ones don't">

    <script type="text/javascript" src="../../resources/testharness.js"></script>
    <script type="text/javascript" src="../../resources/testharnessreport.js"></script>

    <style type="text/css">

        /* This is just 'paesing test'. So noexist URL is ok. */
        @font-face {
            font-family: cssTestBasicFont;
            src: url(http://example.com/testfont.ttf);
        }

        p {
            font-family: cssTestBasicFont, serif;
        }



    </style>

</head>
<body>
    
    <div id="log"></div>
    <p>test</p>

    <script>

        var sheet = document.styleSheets[0];

        var path = "http://example.com/testfont.ttf";

        /* strip out just values */
        function extractDecl(rule){
            // console.log(rule);
            var t = rule.split(/\s/).join("");
            console.log(t);
            return t;
        }

        function testFontFaceParser(){

            var expected = "@font-face { font-family: cssTestBasicFont; src: url("+path+"); }";
            var actual = extractDecl(sheet.cssRules[0].cssText);

            test(function(){
                assert_equals(extractDecl(actual),extractDecl(expected));
            },'tests that valid @font-face rules parse.');

        }

        testFontFaceParser();




    </script>
    
</body>
</html>
